{% extends '@SyliusShop/Account/layout.html.twig' %}

{% form_theme form '@SyliusUi/Form/theme.html.twig' %}

{% block breadcrumb %}
    <div class="ui breadcrumb">
        <a href="{{ path('sylius_shop_homepage') }}" class="section">{{ 'sylius.ui.home'|trans }}</a>
        <div class="divider"> / </div>
        <a href="{{ path('sylius_shop_account_dashboard') }}" class="section">{{ 'sylius.ui.my_account'|trans }}</a>
        <div class="divider"> / </div>
        <div class="active section">{{ 'sylius.ui.personal_information'|trans }}</div>
    </div>
{% endblock %}

{% block subcontent %}
    <div class="ui segment">
        {{ form_start(form, {'action': path('sylius_shop_account_profile_update'), 'attr': {'class': 'ui loadable form', 'novalidate': 'novalidate'}}) }}
        <h1 class="ui dividing header">
            {{ 'sylius.ui.your_profile'|trans }}
            <div class="sub header">{{ 'sylius.ui.edit_your_personal_information'|trans }}</div>
        </h1>

        {{ sonata_block_render_event('sylius.shop.account.profile.update.after_content_header', {'customer': customer, 'form': form}) }}

        <input type="hidden" name="_method" value="PUT" />

        <div class="two fields">
            <div class="field">{{ form_row(form.firstName) }}</div>
            <div class="field">{{ form_row(form.lastName) }}</div>
        </div>
        {{ form_row(form.email) }}
        <div class="two fields">
            <div class="field">{{ form_row(form.birthday) }}</div>
            <div class="field">{{ form_row(form.gender) }}</div>
        </div>
        {{ form_row(form.phoneNumber) }}
        {{ form_row(form.subscribedToNewsletter) }}

        {{ sonata_block_render_event('sylius.shop.account.profile.update.form', {'customer': customer, 'form': form}) }}

        <button type="submit" class="ui large primary button">{{ 'sylius.ui.save_changes'|trans }}</button>
        {{ form_row(form._token) }}
        {{ form_end(form, {'render_rest': false}) }}
    </div>
{% endblock %}
